<html ng-app="ionicApp">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>沙龙详情demo</title>
   
    <link href="https://cdn.bootcss.com/ionic/1.3.2/css/ionic.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/ionic/1.3.2/js/ionic.bundle.min.js"></script>
    <script>
    angular.module('ionicApp', ['ionic'])

	.controller('MyCtrl', function($scope) {
	  
		  
	  	 	  
	  $scope.items = [
      { id: 0 ,
        name:'"金葵花" 金融与实业',
        type:"亲子活动",
        date:"2017-10-01",
        time:"09:30:00",
        adviser:"秦四军",
        targetClientNum:30,
        inviteClientNum:31,
        visitClientNum:32,
        expectSellTarget:"销售目标销售目标销售目标销售目标销售目标销售目标销售目标销售目标销售目标销售目标销售目标销售目标销售目标销售目标",
        clientScript:"客户描述客户描述客户描述客户描述客户描述客户描述客户描述客户描客户描述客户描述客户描述客户描述客户描述客户描述客户描述客户描述客户描述客户"
      }
	  ];

    $scope.items[0]['id']==0?$scope.adviserTitle="预约财富顾问":$scope.adviserTitle="预约财富主管";
	  
	});
    </script>

    <style>
      body{
        height: 100%;
        overflow-y: auto;
        color: #a8a7a7;
      }
    .salon-style {
      min-height: 40px;
      line-height: 40px;
      /* padding-top: 10px; */
      font-size: 13px;
      color: #464646;
    }
    .event-title{
      font-size: 13px;
      color: #464646;
      vertical-align: 12px;
    }
    .salon-title{
      color: #a8a7a7;
    }
    .wrap{
      white-space:normal;
    }
    .fr{
      float: right;
    }
    .w60{
      display: block;
      width: 64%;
    }
    .titleImg{
      display: inline-block;
      height: 40px;
      width: 47px;
      background: url(./eventDetail.png) ;
    }
    .titleImg-client{
      background: url(./clientInfo.png) ;
    }
    .target-title{
      font-size: 13px;
      color: #464646;
    }
    </style>

  </head>

  <body ng-controller="MyCtrl">
    
    <ion-header-bar class="bar-light" align-title="center">
      <!-- 左侧返回按钮 -->
      <div class="buttons">
        <button class="button no-animation button-icon icon ion-chevron-left"
          ng-click="getValue()"></button>
      </div>
      <div class="h1 title">沙龙详情</div>
    </ion-header-bar>

      <div class="content has-header ionic-pseudo">
            
        <div class="list">
          <a class="item" href="javascript:void(0)">
            <div class=" f13">
              <span class="titleImg"></span>
              <span class="event-title">活动详情</span>
            </div>
          </a>

          <a class="item" href="javascript:void(0)">
            <div class="salon-style f13">
              <span class="salon-title colorgre4">沙龙主题</span>
              <span class="fr">{{items[0].name}}</span>
            </div>
          </a>

          <a class="item" href="javascript:void(0)">
            <div class="salon-style f13">
              <span class="salon-title colorgre4">沙龙类型</span>
              <span class="fr">{{items[0].type}}</span>
            </div>
          </a>

          <a class="item" href="javascript:void(0)">
            <div class="salon-style f13">
              <span class="salon-title colorgre4">预计举办时间</span>
              <span class="fr">{{items[0].date}} {{items[0].time}}</span>
            </div>
          </a>

          <a class="item" href="javascript:void(0)">
            <div class="f13 target-title" style="padding:0">
              <span class="salon-title colorgre4" style="padding:0">预期销售目标</span>
              <div class="w60 wrap fr" style="padding:0">{{items[0].expectSellTarget}}</div>
            </div>
          </a>

          <a class="item" href="javascript:void(0)">
            <div class="salon-style f13">
              <span class="salon-title colorgre4">{{adviserTitle}}</span>
              <span class="fr">{{items[0].adviser}}</span>
            </div>
          </a>
        </div>

        <div class="list">

          <a class="item" href="javascript:void(0)">
            <div class=" f13">
              <span class="titleImg titleImg-client"></span>
              <span class="event-title">客户信息</span>
            </div>
          </a>

          <a class="item" href="javascript:void(0)">
            <div class="salon-style f13">
              <span class="salon-title colorgre4">客户目标数</span>
              <span class="fr">{{items[0].targetClientNum}}</span>
            </div>
          </a>

          <a class="item" href="javascript:void(0)">
            <div class="salon-style f13">
              <span class="salon-title colorgre4">客户邀约数</span>
              <div class="fr">{{items[0].inviteClientNum}}</div>
            </div>
          </a>

          <a class="item" href="javascript:void(0)">
            <div class="salon-style f13">
              <span class="salon-title colorgre4">客户到访数</span>
              <div class="fr">{{items[0].visitClientNum}}</div>
            </div>
          </a>

          <a class="item" href="javascript:void(0)">
            <div class="f13 target-title" style="padding:0">
              <span class="salon-title colorgre4" style="padding:0">客户描述</span>
              <div class="w60 wrap fr" style="padding:0">{{items[0].clientScript}}</div>
            </div>
          </a>
        </div>
            
      </div>

  </body>
</html>
